{include file="public/header"/}
<body class="gray-bg">
<div class="wrapper wrapper-content">
    <div class="row">
        <div class="col-sm-12">
            <div class="ibox float-e-margins">
                <div class="alert alert-danger ibox-content" style="text-align:center">
                    <button aria-hidden="true" data-dismiss="alert" class="close" type="button">×</button>
                    <div>尊敬的管理员<span id="weather"></span></div>
                </div>
            </div>
        </div>
    </div>

    <!-- 上方tab -->
    <div class="row">
        <div class="col-sm-3">
            <div class="ibox float-e-margins">
                <div class="ibox-title">
                    <span class="label label-success pull-right">地区</span>
                    <h5>区域</h5>
                </div>
                <div class="ibox-content">
                    <h1 class="no-margins" id="tip1">{$type ? $type.'-': '' }{$area}</h1>
                    <small>负责地区</small>
                    <div style="float: right;">
                        <a href="/admin/center/index3" target="_blank">积分交易表</a> ｜
                        <a href="/admin/center/index6" target="_blank">现金交易表</a>
                    </div>
                </div>
            </div>
        </div>
        <div class="col-sm-3">
            <div class="ibox float-e-margins">
                <div class="ibox-title">
                    <span class="label label-success pull-right">个</span>
                    <h5>积分池数</h5>
                </div>
                <div class="ibox-content">
                    <h1 class="no-margins" id="tip2">{$data.pool}</h1>
                    <small>总积分数量</small>
                </div>

                    
            </div>
        </div>
        <div class="col-sm-3">
            <div class="ibox float-e-margins">
                <div class="ibox-title">
                    <span class="label label-success pull-right">个</span>
                    <h5>剩余积分数</h5>
                </div>
                <div class="ibox-content">
                    <h1 class="no-margins" id="tip3">{$data.integral}</h1>
                    <small>剩余积分总数量</small>
                </div>
            </div>
        </div>
        <div class="col-sm-3">
            <div class="ibox float-e-margins">
                <div class="ibox-title">
                    <span class="label label-success pull-right">元</span>
                    <h5>余额</h5>
                </div>
                <div class="ibox-content">
                    <h1 class="no-margins" id="tip4">{$data.balance}<span class="layui-btn" style="float:right;" onclick="tixian()">提现</span></h1>
                    <small>账户余额</small>
                </div>
            </div>
        </div>
    </div>
    <div class="row">
        <div class="col-sm-12">
            <div class="ibox float-e-margins">
                <div class="ibox-content" >
                    <div class="echarts" id="echarts-pie-chart" style="height: 500px!important;"></div>
                </div>
            </div>
        </div>
    </div>
</div>
<script src="__JS__/jquery.min.js"></script>
<script src="__JS__/jquery.leoweather.min.js"></script>
<script src="__JS__/echarts.min.js"></script>
<script src="__JS__/plugins/layui/layui.all.js"></script>
<script src="__JS__/wk.js"></script>
<script>
    var tixian = function(){
        layer.open({
            type: 1,
            anim: 0,//css动画 0-6
            isOutAnim:true,
            fix: false, //不固定
            maxmin: false,//最大最小化
            shadeClose:true,//点击遮罩层关闭
            scrollbar: false,//屏蔽浏览器滚动条
            area:['500px', '320px'],
            title:'余额提现',
            content: '<div class="layui-fluid layui-col-xs12">\n' +
            '        <div class="layui-card-body layui-form layui-form-pane">\n' +
            '            <div class="layui-row layui-form-item ">\n' +
            '                <div class="layui-form-item">\n' +
            '                    <label class="layui-form-label">可提余额</label>\n' +
            '                    <div class="layui-input-block">\n' +
            '                        <input type="text" class="layui-input" id="can" value="{$data.balance}" disabled/>\n' +
            '                    </div>\n' +
            '                </div>\n' +
            '                <div class="layui-form-item">\n' +
            '                    <label class="layui-form-label">提现金额</label>\n' +
            '                    <div class="layui-input-block">\n' +
            '                        <input type="text" name="money"  placeholder="提现金额（整数）" lay-verify="required|money" class="layui-input" autocomplete="off" oninput="value=value.replace(/[^\\d]/g,\'\')"/>\n' +
            '                    </div>\n' +
            '                </div>\n' +
            '                <div class="layui-form-item">\n' +
            '                    <label class="layui-form-label">用户账号</label>\n' +
            '                    <div class="layui-input-block">\n' +
            '                        <input type="text" name="phone"  placeholder="提现到用户端的手机号" lay-verify="required|phone" class="layui-input" autocomplete="off"/>\n' +
            '                    </div>\n' +
            '                </div>\n' +
            '                <div class="layui-form-item">\n' +
            '                    <div class="layui-input-block">\n' +
            '                        <button class="layui-btn" lay-submit="" lay-filter="component-form-element">提现\n' +
            '                        </button>\n' +
            '                    </div>\n' +
            '                </div>\n' +
            '            </div>\n' +
            '        </div>\n' +
            '    </div>'
        });
    }
    layui.use(['form'], function() {
        var form = layui.form;
        form.verify({
            money:function(value,item){
                if(parseInt(value) > parseInt($("#can").val())){
                    return '提现金额不可大于可提现余额'
                }
            }
        });
        form.on('submit(component-form-element)', function (data) {
            if(parseInt($("#can").val()) == 0){
                wk.error('金额不足');
                return;
            }
            $('.layui-btn').addClass('layui-disabled').attr('disabled','disabled');
            $.ajax({
                url:"{:url('User/getMoney')}",
                type:'post',
                dataType:'json',
                data:data.field,
                success:function(res){
                    if (res.code == 200) {
                        wk.success(res.msg,'','$(".layui-btn").removeClass(\'layui-disabled\').removeAttr(\'disabled\');layer.closeAll();window.location.reload(true);');
                    } else {
                        wk.error(res.msg,'','$(".layui-btn").removeClass(\'layui-disabled\').removeAttr(\'disabled\');');
                    }
                }
            })
        });
    });


    var l = echarts.init(document.getElementById("echarts-pie-chart")),
        u = {
            title : {
                text: '积分动态数据图',
                subtext: '实时数据',
                x:'center'
            },
            tooltip : {
                trigger: 'item',
                formatter: "{a} <br/>{b} : {c} ({d}%)"
            },
            legend: {
                orient: 'vertical',
                x: 'left',
                data: {$info}
            },
            series : [
                {
                    name: '积分数据',
                    type: 'pie',
                    radius : '55%',
                    // center: ['50%', '60%'],
                    label: {
                        normal: {
                            formatter: '{a|{a}}{abg|}\n{hr|}\n  {b|{b}：}{c}  {per|{d}%}  ',
                            backgroundColor: '#eee',
                            borderColor: '#aaa',
                            borderWidth: 1,
                            borderRadius: 4,
                            // shadowBlur:3,
                            // shadowOffsetX: 2,
                            // shadowOffsetY: 2,
                            // shadowColor: '#999',
                            // padding: [0, 7],
                            rich: {
                                a: {
                                    color: '#999',
                                    lineHeight: 22,
                                    align: 'center'
                                },
                                // abg: {
                                //     backgroundColor: '#333',
                                //     width: '100%',
                                //     align: 'right',
                                //     height: 22,
                                //     borderRadius: [4, 4, 0, 0]
                                // },
                                hr: {
                                    borderColor: '#aaa',
                                    width: '100%',
                                    borderWidth: 0.5,
                                    height: 0
                                },
                                b: {
                                    fontSize: 16,
                                    lineHeight: 33
                                },
                                per: {
                                    color: '#eee',
                                    backgroundColor: '#334455',
                                    padding: [2, 4],
                                    borderRadius: 2
                                }
                            }
                        }
                    },
                    data:{$arr},
                    itemStyle: {
                        emphasis: {
                            shadowBlur: 10,
                            shadowOffsetX: 0,
                            shadowColor: 'rgba(0, 0, 0, 0.5)'
                        }
                    }
                }
            ]
        };
    l.setOption(u), $(window).resize(l.resize);
</script>
<script type="text/javascript">
    $('#weather').leoweather({
        format:'，{时段}好！<span id="colock">现在时间是：<strong>{年}年{月}月{日}日 星期{周} {时}:{分}:{秒}</strong></span> '
    });
</script>
<script>
    //实时刷新数据
    $(function(){
        // setInterval("getAdminCount('tip1','admin','{:url(\"admin/Index/indexPage\")}')",5000);
        // setInterval("getRoleCount('tip2','role','{:url(\"admin/Index/indexPage\")}')",5000);
        // setInterval("getMenuCount('tip3','menu','{:url(\"admin/Index/indexPage\")}')",5000);
        // setInterval("getConfigCount('tip4','config','{:url(\"admin/Index/indexPage\")}')",5000);
    })
    //管理员
    function getAdminCount(obj,type,url){
        wk.refresh(obj,type,url);
    }
    //角色
    function getRoleCount(obj,type,url){
        wk.refresh(obj,type,url);
    }
    //菜单
    function getMenuCount(obj,type,url){
        wk.refresh(obj,type,url);
    }
    //配置
    function getConfigCount(obj,type,url){
        wk.refresh(obj,type,url);
    }
</script>
</body>
</html>